import type { Config } from 'tailwindcss'
import { nextui } from '@nextui-org/react'

const config: Config = {
  content: [
    './src/pages/**/*.{js,ts,jsx,tsx,mdx}',
    './src/components/**/*.{js,ts,jsx,tsx,mdx}',
    './src/app/**/*.{js,ts,jsx,tsx,mdx}',
    './node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}',
  ],
  theme: {
    extend: {
      gridTemplateColumns: {
        18: 'repeat(18, minmax(0, 1fr))',
      },
      padding: {
        homeScrollPaddingLg: 'calc((100vw - 960px) / 2)',
        homeScrollPadding2xl: 'calc((100vw - 1200px) / 2)',
      },
      width: {
        homeCaseItem: 'calc(100vw - 1.875rem)',
        homeCaseItemContent: 'calc((100vw - 1.875rem) * 0.9188)',
        aboutCompanyProfile: 'calc(100vw - 1.875rem)',
        aboutConcept: 'calc(100vw - 1.875rem)',
        pictureGrid: 'calc(100vw - 1.875rem)',
        productsPopover: 'clac(100vw - 3rem)',
      },
      height: {
        homeCaseItem: 'calc((100vw - 1.875rem) * 0.59)',
        aboutCompanyProfile: 'calc((100vw - 1.875rem) * 1.03)',
        aboutConcept: 'calc((100vw - 1.875rem) * 0.5768)',
        pictureGrid: 'calc((100vw - 1.875rem) * 0.7)',
      },
      colors: {
        'product-card-gradient-top': 'rgba(167, 198, 40, 0.8)',
        'product-card-gradient-bottom': 'rgba(167, 200, 52, 0.2)',
      },
      backgroundImage: {
        'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))',
        'gradient-conic':
          'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))',
      },
    },
  },
  plugins: [require('@tailwindcss/aspect-ratio'), nextui()],
}
export default config
